<template>
  <ul>
    <li v-for="item in goodsListarr" :key="item.id">
      <img :src="item.list_pic_url" alt />
      <p>{{item.name}}</p>
      <div>￥{{item.retail_price}}元</div>
    </li>
  </ul>
</template>

<script>
export default {
  props:['goodsListarr']
};
</script>

<style lang="less" scoped>
ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 5px;
  li {
    width: 49.5%;
    margin-bottom: 5px;
    background: #fff;
    position: relative;
    img {
      height: 180px;
      width: 100%;
    }
    p {
      text-align: center;
      margin: 0;
    }
    div {
      color: darkred;
      text-align: center;
      line-height: 30px;
    }
  }
}
</style>